import {Component, OnInit, ViewEncapsulation} from '@angular/core';
import {HomeService} from "../home.service";
import QRious from 'qrious';
import * as JsBarcode from 'jsbarcode';
import {NzNotificationService} from "ng-zorro-antd";

declare var getLodop: any;

@Component({
  selector: 'app-home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.scss'],
  encapsulation: ViewEncapsulation.None
})
export class HomeComponent implements OnInit {
  public printDatas: any = [
    {
      address: 'Room 501, unit 6, building 20, North Lane, east flower market, Beijing',
      linkName: 'Andy',
      phone: '12345679',
      email: '123456@test.com',
      poNumber: 'Welfare SAP SO805',
      boxNum: 1,
      itemBoxNum: '3',
      itemSku: 'pi-top-1000',
      itemSummary: '随便写点备注吧，此次下单共十五件产品',
      itemNum: '6',
    },
    {
      address: 'Room 501, unit 6, building 20, North Lane, east flower market, Beijing',
      linkName: 'Andy',
      phone: '12345679',
      email: '123456@test.com',
      poNumber: 'Welfare SAP SO805',
      boxNum: 2,
      itemBoxNum: '3',
      itemSku: 'pi-top-1000',
      itemSummary: '随便写点备注吧，此次下单共十五件产品',
      itemNum: '6',
    },
    {
      address: 'Room 501, unit 6, building 20, North Lane, east flower market, Beijing',
      linkName: 'Andy',
      phone: '12345679',
      email: '123456@test.com',
      poNumber: 'Welfare SAP SO805',
      boxNum: 3,
      itemBoxNum: '3',
      itemSku: 'pi-top-1000',
      itemSummary: '随便写点备注吧，此次下单共十五件产品',
      itemNum: '3',
    }
  ];//打印数据
  private LODOP: any;
  private timer: Array<number> = [];

  constructor(private homeService: HomeService, private notification: NzNotificationService) {
  }

  ngOnInit() {

  }

  print(box) {
    this.createData(this.printDatas[box - 1]);
  }

// 生成数据
  createData(printData) {
    this.LODOP = getLodop();
    let codeData = printData.poNumber;
    this.CreateOnePage(printData, codeData);
    // let url = new QRious({value: codeData, padding: 10, size: 150,}).toDataURL();
    /*JsBarcode("#barcode", printData.poNumber, {
      // format: "codabar",
      height: 70
    });*/
  }

  //创建新页面
  CreateOnePage(printData, codeData) {
    if (!this.LODOP) this.LODOP = getLodop();
    // this.LODOP.SET_PRINT_PAGESIZE(1, 0, 0, 'A6');  //布局没弄清之前不要修改宽高(1020*1530)
    this.LODOP.SET_PRINT_PAGESIZE(1, '102mm', '153mm', '');  //布局没弄清之前不要修改宽高(1020*1500)
    // this.LODOP.SET_PRINT_STYLE("FontName", 'Microsoft YaHei');
    let htmlstr = `<style>*{font-family: 'Microsoft YaHei';letter-spacing: 0;font-size: 12px;line-height: 18px;}</style>
      <body style="overflow: hidden;"><div style="position: relative;">
        <div style="width: 55%;">
          <div style="margin-bottom: 15px;margin-top: 15px">
            <h3 style="vertical-align: middle;"><span style="font-size: 13px;">Supplier : </span><span style="font-size: 15px"> CEED LTD.</span></h3>
          </div>
          <div style="height: 110px;">
            <h3 style="margin-bottom: 10px;font-size: 13px;">Address:</h3>
            <div>${printData.address}</div>
          </div>
          <div style="height: 110px;">
            <h3 style="margin-bottom: 10px;font-size: 13px;">Contact:</h3>
            <div style="margin-bottom: 5px;">${printData.linkName}</div>
            <div style="margin-bottom: 8px;">${printData.phone}</div>
            <div>${printData.email}</div>
          </div>
          <div style="height: 60px;">
            <h3 style="margin-bottom: 10px;font-size: 13px;">PO Number:</h3>
            <div>${printData.poNumber}</div>
          </div>
        </div>
        <div style="width: 45%;position: absolute;top: 0;right: 0;">
          <div style="height: 150px;">
            <!--<div style="padding: 5px 10px;"><strong>Carton No:</strong></div>-->
            <div style="height: 135px;"></div>
            <div style="text-align: center;"><strong>${printData.boxNum} of ${printData.itemBoxNum}</strong></div>
          </div>
        </div>
      </div>
      <div style="width: 100%;">
        <h3 style="margin-bottom: 5px;">Carton Contents</h3>
        <table border="1" style="width: 100%;border:solid 1px black;border-collapse:collapse;
        -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;">
          <thead>
          <tr style="height: 35px;">
            <th style="width: 36%;">Part No.</th>
            <th style="width: 44%;">Description</th>
            <th style="width: 20%;">Quantity</th>
          </tr>
          </thead>
          <tbody>
          <tr style="height: 90px;" valign="top">
            <td style="padding: 8px 5px;">${printData.itemSku}</td> 
            <td style="padding: 8px 5px;line-height: 18px;">${printData.itemSummary}</td> 
            <td style="padding: 20px 5px 5px;" align="center"><span style="font-size: 18px;font-weight: 600;">${printData.itemNum}</span></td>
          </tr>
          </tbody>
        </table>
        <h3 style="text-align: center;font-size: 15px;margin-top: 8px;">MADE IN CHINA</h3>
      </div>
      </body>`;
    //添加当前箱号，使用HTML，是为了保证箱号显示的位置比较居中
    let curNumStr = `<div style="width: 160px;height: 80px;display: inline-block;background-color: transparent;
line-height: 80px;text-align: center;font-size: 100px;font-family: '宋体';">${printData.boxNum}</div>`;
    //win7中需注意API使用顺序，先引用HTML后生成二维码，二维码会被HTML覆盖，无法显示
    //1020*1530
    this.LODOP.ADD_PRINT_HTM(10, 10, 365, 560, htmlstr);//参数（上边距，左边距，款，高，内容）
    this.LODOP.ADD_PRINT_HTM(210, 210, 160, 80, curNumStr);//当前箱号；参数（上边距，左边距，款，高，内容）
    this.LODOP.ADD_PRINT_BARCODE(45, 234, 130, 130, 'QRCode', codeData);//二维码 (Top, Left,Width, Height, CodeType, CodeValue)
    this.LODOP.ADD_PRINT_BARCODE(320, 210, 160, 56, '128Auto', codeData);//条形码 (Top, Left,Width, Height, CodeType, CodeValue)
    //A6设置
    // this.LODOP.ADD_PRINT_HTM(10, 10, 380, 590, htmlstr);//参数（上边距，左边距，款，高，内容）
    // this.LODOP.ADD_PRINT_HTM(190, 210, 170, 80, curNumStr);//当前箱号；参数（上边距，左边距，款，高，内容）
    // this.LODOP.ADD_PRINT_BARCODE(46, 250, 130, 130, 'QRCode', codeData);//二维码 (Top, Left,Width, Height, CodeType, CodeValue)
    // this.LODOP.ADD_PRINT_BARCODE(320, 210, 170, 60, 'Codabar', codeData);//条形码 (Top, Left,Width, Height, CodeType, CodeValue)
    this.LODOP.SET_PRINT_MODE("CATCH_PRINT_STATUS", true);
    this.checkLodopState(this.LODOP, printData);
  };

  //获取lodop状态
  checkLodopState(LODOP, printData) {
    let me = this;
    if (LODOP.CVERSION) {
      LODOP.On_Return = function (taskID, value) {
        let P_ID = value;
        if (P_ID != '') {
          me.cWaitFor(LODOP, P_ID, printData);
        }
      };
      if (printData.boxNum === 1) LODOP.PRINTA();
      else if (printData.boxNum === 2) LODOP.PRINT();
      else if (printData.boxNum === 3) LODOP.PREVIEW();
      me.notification.info(`第${printData.boxNum}箱，打印中...`, `正在打印第${printData.boxNum}箱出货单`, {nzDuration: 10000});
    } else {
      let P_ID = LODOP.PRINTA();
      if (P_ID != '') {
        me.waitFor(LODOP, P_ID, printData);
        this.notification.info(`第${printData.boxNum}箱，打印中...`, `正在打印第${printData.boxNum}箱出货单`, {nzDuration: 10000});
      }
    }
  }

  //云打印状态等待
  cWaitFor(LODOP, P_ID, printData) {
    let me = this;
    this.timer[printData.boxNum] = setTimeout(function () {
      me.cWaitFor(LODOP, P_ID, printData)
    }, 1000);
    LODOP.On_Return_Remain = true;
    let TaskOk = LODOP.GET_VALUE("PRINT_STATUS_OK", P_ID);
    let TaskExist = LODOP.GET_VALUE("PRINT_STATUS_EXIST", P_ID);
    LODOP.On_Return = function (TaskID, Value) {
      if (TaskID == TaskOk && Value == 1) {
        me.notification.success(`第 ${printData.boxNum} 箱`, `第${printData.boxNum}箱出货单打印成功`, {nzDuration: 10000});
        clearTimeout(me.timer[printData.boxNum]);
      } else if (TaskID == TaskExist && Value == 0) {
        me.notification.success(`第 ${printData.boxNum} 箱`, `第${printData.boxNum}箱出货单打印成功`, {nzDuration: 10000});
        console.log('打印任务' + P_ID + '已被删除');
        clearTimeout(me.timer[printData.boxNum]);
      }
    }
  }

  //本地打印状态等待
  waitFor(LODOP, P_ID, printData) {
    let me = this;
    this.timer[printData.boxNum] = setTimeout(function () {
      me.waitFor(LODOP, P_ID, printData)
    }, 1000);
    if (LODOP.GET_VALUE("PRINT_STATUS_OK", P_ID) || !LODOP.GET_VALUE("PRINT_STATUS_EXIST", P_ID)) {
      me.notification.success(`第 ${printData.boxNum} 箱`, `第${printData.boxNum}箱出货单打印成功`, {nzDuration: 10000});
      clearTimeout(this.timer[printData.boxNum]);
    }
  }

}
